<template>
  <div class="app-container">
    <el-tabs v-model="activeName" @tab-click="handleTabClick">
      <el-tab-pane label="我的" name="first">
        <MyToDoTask></MyToDoTask>
      </el-tab-pane>
      <el-tab-pane label="待办" name="second">
        <ToDoTask v-if="activeName=='second'" businessType="safetyCheckTask"></ToDoTask>
      </el-tab-pane>
      <el-tab-pane label="已办" name="third">
        <DoneTask v-if="activeName=='third'" businessType="safetyCheckTask"></DoneTask>
      </el-tab-pane>
      <el-tab-pane label="办结" name="fourth">
        <FinishedFlow v-if="activeName=='fourth'" businessType="safetyCheckTask"></FinishedFlow>
      </el-tab-pane>
      <el-tab-pane label="抄送" name="fifth">
        <CopyToFlow v-if="activeName=='fifth'" businessType="safetyCheckTask"></CopyToFlow>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import MyToDoTask from "@/views/labsafety/labsafetyTask/to_do_task.vue";
import ToDoTask from "@/views/labdata/flowTask/todo_task.vue";
import DoneTask from "@/views/labdata/flowTask/done_task.vue";
import FinishedFlow from "@/views/labdata/flowInstance/finished_flow.vue";
import CopyToFlow from "@/views/labdata/flowInstance/copyto_flow.vue";
export default {
  name: "LabsafetyTask",
  components: { MyToDoTask, ToDoTask, DoneTask, FinishedFlow, CopyToFlow },
  data() {
    return {
      activeName: 'first',
      // 遮罩层
      loading: true,
      // 表单参数
      form: {},
      // 表单校验
      rules: {
      }
    };
  },
  created() {
  },
  methods: {
    handleTabClick(e) {
    }
  }
};
</script>
<style type="text/css" scoped>
  .form_long{
    width:475px;
  }
  .form_short{
    width:200px;
  }
  .el-button.active{
    text-decoration: underline;
    color: #0000ee;
  }
  .el-button.dis_active {
    color: #999999
  }
  .select_view {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
</style>
